<template>
  <div class="page">
    <LsdDialog :dialogConfig="['edit', 'add'].includes(type.code) ? dialogConfig : dialogConfig1" @handleBtn="handleBtn"
      @close="handleClose">
      <LsdDialogTitle slot="dialog" :titleConfig="titleConfig" :activeNames="activeNames">
        <DialogForm ref="formComponent" slot="slot1" @clearValue="clearValue" @change="radioChange"
          @changeEvent="handleChange" :formConfig="formConfig" />
        <LsdTable :autoHeight="tableList.autoHeight" slot="slot2" :compRef="tableList.compRef" ref="gjxm"
          :columns="type.code === 'approval' ? tableList.columns1 : tableList.columns" :tableData="tableList.tableData"
          :tableAttr="tableList.tableAttr" :isSequenceFlag="tableList.isSequenceFlag" />
        <LsdTable :autoHeight="tableList1.autoHeight" slot="slot3" :compRef="tableList1.compRef" ref="gjxm1"
          :columns="type.code === 'approval' ? tableList1.columns1 : tableList1.columns" :tableData="tableList1.tableData"
          :tableAttr="tableList1.tableAttr" :isSequenceFlag="tableList1.isSequenceFlag" />
        <DialogForm slot="slot4" ref="formComponent3" :formConfig="formConfig3" />
        <DialogForm slot="slot5" ref="formComponent4" :formConfig="formConfig4" />
      </LsdDialogTitle>
    </LsdDialog>
  </div>
</template>

<script>
import { showTime } from "@/lib";
// TemplateQuery
import { detailSave, detailSubmit, getDetailById, TestUserOption, selectResponse, responseDetail, detailApproval, commandTemplate, commandTemplateDetail } from "@/api/EmergencyDisposal/yjzhb";
import { getDictByGroupEmergency } from "@/api/common.js";
export default {
  name: "Emheadquartersadd",
  components: {},
  props: {
    dialogVisible: {
      type: Boolean,
      default: false
    },
    type: {
      type: Object,
      default: function () {
        return {};
      }
    },
    id: {
      type: [String, Number],
      default: function () {
        return "";
      }
    }
  },
  data() {
    return {
      tableList: {
        isSelectFlag: false,
        compRef: "zhry",
        isSequenceFlag: false,
        isShowPage: true,
        resetFlag: true,
        loading: false,
        autoHeight: true,
        title: "响应命令单列表",
        actions: [],
        tableData: [],
        columns: [
          {
            prop: "post",
            label: "岗位",
            align: "center"
          },
          {
            prop: "userName",
            label: "姓名",
            align: "center",
            "min-width": "140px"
            // render: (h, { row }) => {
            //   return (
            //     <div class='peizhi'>
            //       <LsdForm
            //         compData={{
            //           elType: "select",
            //           id: "userName",
            //           name: "userId",
            //           label: "姓名",
            //           // dic: "dic_zrbm",
            //           attrs: {
            //             value: "",
            //             clearable: true,
            //             filterable: true,
            //             disabled: false,
            //             multiple: false,
            //             "collapse-tags": true
            //           },
            //           options: this.namelist
            //         }}
            //         form={row}
            //         {...{
            //           on: {
            //             change: (val) => {
            //               console.log(val, "---val");
            //               row.userId = val;
            //               this.namelist.map(i => {
            //                 if (i.value === val) {
            //                   row.userName = i.label;
            //                 }
            //               });
            //               const parmas = {
            //                 pageNum: 1,
            //                 pageSize: 10,
            //                 id: val
            //               };
            //               // TestUserOption(parmas).then(res => {
            //               TestUserOption(parmas).then(res => {
            //                 row.contact = res[0].contact;
            //                 row.duty = res[0].duty;
            //                 row.unitDept = res[0].unitDept;
            //               });
            //             }
            //           }
            //         }}
            //       ></LsdForm>
            //     </div>
            //   );
            // }
          },
          {
            prop: "contact",
            label: "联系方式",
            align: "center"
          },
          {
            prop: "unitDept",
            label: "单位及部门",
            align: "left"
          },
          {
            prop: "duty",
            label: "职务",
            align: "center"
          },
          {
            prop: "responsibility",
            label: "职责",
            align: "center",
            "min-width": "200px"
          }
        ],
        columns1: [
          {
            prop: "post",
            label: "岗位",
            align: "center"
          },
          {
            prop: "userName",
            label: "姓名",
            align: "center",
            "min-width": "140px"
            // render: (h, { row }) => {
            //   return (
            //     <div class='peizhi'>
            //       {row.userName}
            //     </div>
            //   );
            // }
          },
          {
            prop: "contact",
            label: "联系方式",
            align: "center"
          },
          {
            prop: "unitDept",
            label: "单位及部门",
            align: "center"
          },
          {
            prop: "duty",
            label: "职务",
            align: "center"
          },
          {
            prop: "responsibility",
            label: "职责",
            align: "left",
            "min-width": "200px"
          }
        ],
        tableAttr: {
          stripe: false,
          border: true,
          fit: true,
          "show-header": true,
          "highlight-current-row": true,
          "cell-style": {
            "font-size": "16px"
          },
          "header-cell-style": {
            "text-align": "center",
            "background-color": "#B1C8F9",
            border: "1px solid #ccc",
            "font-size": "16px"
          }
        }
      },
      tableList1: {
        isSelectFlag: true,
        compRef: "fzfz",
        isSequenceFlag: false,
        isShowPage: true,
        autoHeight: true,
        resetFlag: true,
        loading: false,
        title: "响应命令单列表",
        actions: [],
        tableData: [
          {
            groupType: "",
            userId: "",
            contact: "",
            unitDept: "",
            duty: "",
            members: "",
            responsibility: ""
          }
        ],
        columns: [
          {
            prop: "workGroup",
            label: "工作组名称",
            align: "center",
            "min-width": "180px"
            // render: (h, { row }) => {
            //   return (
            //     <div class='peizhi'>
            //       <LsdForm
            //         compData={{
            //           elType: "select",
            //           id: "workGroup",
            //           name: "workGroupId",
            //           label: "工作组名称",
            //           // dic: "dic_zrbm",
            //           attrs: {
            //             value: "",
            //             clearable: true,
            //             filterable: true,
            //             disabled: false,
            //             multiple: false,
            //             "collapse-tags": true
            //           },
            //           options: this.gzzmclist
            //         }}
            //         form={row}
            //         {...{
            //           on: {
            //             change: (val) => {
            //               row.workGroupId = val;
            //               TemplateQuery({ groupType: val, templateType: "2" }).then(res => {
            //                 console.log(res, "????????");
            //                 row.responsibility = res[0].responsibility;
            //                 row.templateId = res[0].id;
            //                 row.userId = res[0].userId;
            //                 row.userName = res[0].userName;
            //                 row.contact = res[0].contact;
            //                 row.unitDept = res[0].unitDept;
            //                 row.duty = res[0].duty;
            //                 row.dept = res[0].dept;
            //                 row.unit = res[0].unit;
            //                 row.memberIds = (res[0].memberIds).split(",");
            //                 row.members = (res[0].members).split(",");
            //               });
            //               console.log(row, "????????????????row");
            //               this.gzzmclist.map(i => {
            //                 if (i.value === val) {
            //                   row.workGroup = i.label;
            //                 }
            //               });
            //             }
            //           }
            //         }}
            //       ></LsdForm>
            //     </div>
            //   );
            // }
          },
          {
            prop: "userName",
            label: "组长",
            align: "center",
            "min-width": "110px"
            // render: (h, { row }) => {
            //   return (
            //     <div class='peizhi'>
            //       <LsdForm
            //         compData={{
            //           elType: "select",
            //           id: "userId",
            //           name: "userName",
            //           label: "组长",
            //           // dic: "dic_zrbm",
            //           attrs: {
            //             value: "",
            //             clearable: true,
            //             filterable: true,
            //             disabled: false,
            //             multiple: false,
            //             "collapse-tags": true
            //           },
            //           options: this.namelist
            //         }}
            //         form={row}
            //         {...{
            //           on: {
            //             change: (val) => {
            //               row.userId = val;
            //               const parmas = {
            //                 pageNum: 1,
            //                 pageSize: 10,
            //                 id: val
            //               };
            //               TestUserOption(parmas).then(res => {
            //                 // TestUserOption(parmas).then(res => {
            //                 row.contact = res[0].contact;
            //                 row.duty = res[0].duty;
            //                 row.unitDept = res[0].unitDept;
            //               });
            //               this.namelist.map(i => {
            //                 if (i.value === val) {
            //                   row.userName = i.label;
            //                 }
            //               });
            //             }
            //           }
            //         }}
            //       ></LsdForm>
            //     </div>
            //   );
            // }
          },
          {
            prop: "contact",
            label: "联系方式",
            align: "center",
            "min-width": "120px"
          },
          {
            prop: "unitDept",
            label: "单位及部门",
            align: "left",
            "min-width": "120px"
          },
          {
            prop: "duty",
            label: "职务",
            align: "center",
            "min-width": "120px"
          },
          {
            prop: "memberIds",
            label: "成员",
            align: "center",
            "min-width": "160px",
            render: (h, { row }) => {
              return (
                <div class='select_members'>
                  <LsdForm
                    compData={{
                      elType: "select",
                      id: "memberIds",
                      name: "members",
                      label: "成员",
                      // dic: "dic_zrbm",
                      attrs: {
                        value: "",
                        clearable: true,
                        filterable: false,
                        disabled: false,
                        multiple: true,
                        "collapse-tags": false
                      },
                      options: this.namelist
                    }}
                    form={row}
                    {...{
                      on: {
                        change: (val) => {
                          row.memberIds = val;
                          this.namelist.map(i => {
                            if (i.value === val) {
                              row.members = i.label;
                            }
                          });
                        }
                      }
                    }}
                  ></LsdForm>
                </div>
              );
            }
          },
          {
            prop: "responsibility",
            label: "职责",
            align: "left",
            "min-width": "260px"
          }
          // {
          //   prop: "cz",
          //   label: "操作",
          //   align: "center",
          //   fixed: "right",
          //   "min-width": "80px",
          //   render: (h, scope) => {
          //     return (
          //       <div>
          //         {
          //           scope.$index === this.tableList1.tableData.length - 1 && (
          //             <img
          //               {...{
          //                 class: {},
          //                 style: {
          //                   width: "16px",
          //                   height: "16px",
          //                   "margin-right": "10px"
          //                 },
          //                 attrs: {
          //                   src: require("@/assets/img/listAdd.png")
          //                 },
          //                 on: {
          //                   click: (scope) => {
          //                     this.tableList1.tableData.push({
          //                       groupType: "",
          //                       userId: "",
          //                       contact: "",
          //                       unitDept: "",
          //                       duty: "",
          //                       members: "",
          //                       responsibility: ""
          //                     });
          //                   }
          //                 }
          //               }}
          //             />
          //           )
          //         }
          //         {
          //           this.tableList1.tableData.length > 1 && (
          //             <img
          //               {...{
          //                 class: {},
          //                 style: {
          //                   width: "16px",
          //                   height: "16px"
          //                 },
          //                 attrs: {
          //                   src: require("@/assets/img/listReduc.png")
          //                 },
          //                 on: {
          //                   click: () => {
          //                     this.tableList1.tableData.splice(scope.$index, 1);
          //                   }
          //                 }
          //               }}
          //             />
          //           )
          //         }
          //       </div>
          //     );
          //   }
          // }
        ],
        columns1: [
          {
            prop: "workGroup",
            label: "工作组名称",
            align: "center",
            "min-width": "180px",
            render: (h, { row }) => {
              return (
                <div class='peizhi'>
                  {row.workGroup}
                </div>
              );
            }
          },
          {
            prop: "userId",
            label: "组长",
            align: "center",
            "min-width": "110px",
            render: (h, { row }) => {
              return (
                <div class='peizhi'>
                  {row.userName}
                </div>
              );
            }
          },
          {
            prop: "contact",
            label: "联系方式",
            align: "center",
            "min-width": "120px"
          },
          {
            prop: "unitDept",
            label: "单位及部门",
            align: "center",
            "min-width": "120px"
          },
          {
            prop: "duty",
            label: "职务",
            align: "center",
            "min-width": "110px"
          },
          {
            prop: "memberIds",
            label: "成员",
            align: "center",
            "min-width": "200px",
            render: (h, { row }) => {
              return (
                <div class='peizhi'>
                  {row.members}
                </div>
              );
            }
          },
          {
            prop: "responsibility",
            label: "职责",
            align: "left",
            "min-width": "260px"
          }
        ],
        tableAttr: {
          height: "",
          stripe: false,
          border: true,
          fit: true,
          "show-header": true,
          "highlight-current-row": true,
          "cell-style": {
            "font-size": "16px"
          },
          "header-cell-style": {
            "text-align": "center",
            "background-color": "#B1C8F9",
            border: "1px solid #ccc",
            "font-size": "16px"
          }
        }
      },
      // 基本信息
      formConfig: {
        formData: [
          {
            type: "select",
            label: "响应命令单",
            prop: "responseId",
            name: "responseName",
            class: "sjgy",
            lableWidth: "140px",
            isShow: true,
            option: []
          },
          {
            type: "radio",
            label: "指挥部级别",
            prop: "headquartersLv",
            name: "headquartersLvName",
            class: "sjgy",
            lableWidth: "140px",
            radio: [
              // {
              //   label: "省级指挥部",
              //   value: 0,
              //   isDisabled: false
              // },
              {
                label: "现场指挥部",
                value: 1,
                isDisabled: false
              }

            ]
          },
          {
            type: "input",
            label: "指挥部名称",
            prop: "headquartersName",
            class: "sjgy",
            lableWidth: "140px"
          },
          {
            type: "select",
            label: "指挥部模板",
            prop: "commandTemplateId",
            name: "commandTemplateName",
            dic: "dic_zhbmb",
            class: "sjgy",
            lableWidth: "140px",
            isShow: true,
            option: []
          }
        ],
        rules: {
          responseId: [
            { required: true, message: "请选择响应命令单", trigger: "burl" }
          ],
          headquartersName: [
            { required: true, message: "请输入指挥部名称", trigger: "input" }
          ],
          commandTemplateId: [
            { required: true, message: "请选择指挥部模板", trigger: "input" }
          ],
          subTaskStatus: [
            { required: true, message: "请选择指挥部级别", trigger: "input" }
          ]
        }
      },
      formConfig3: {
        formData: [
          {
            type: "input",
            label: "填报人",
            prop: "creator",
            class: "third",
            lableWidth: "140px",
            isDisabled: true
          },
          {
            type: "input",
            label: "单位及部门",
            prop: "createDeptName",
            class: "third",
            lableWidth: "140px",
            isDisabled: true
          },
          {
            type: "input",
            label: "填报时间",
            prop: "createTime",
            class: "third",
            lableWidth: "140px",
            isDisabled: true
          }
        ]
      },
      // 弹窗表单信息
      formConfig4: {
        formData: [
          {
            type: "input",
            label: "审批意见",
            prop: "approvalOpinion",
            class: "sjgy",
            lableWidth: "140px"
          },
          {
            type: "input",
            label: "审批人",
            prop: "approvalUser",
            class: "third",
            isDisabled: true,
            lableWidth: "140px"
          },
          {
            type: "input",
            label: "单位及部门",
            prop: "approvalDept",
            class: "third",
            isDisabled: true,
            lableWidth: "140px"
          },
          {
            type: "input",
            label: "审批时间",
            prop: "approvalTime",
            class: "third",
            isDisabled: true,
            lableWidth: "140px"
          }

        ]
      },
      // 折叠面板信息
      titleConfig: [
        {
          title: "基本信息",
          name: "1",
          slot: "slot1"
        },
        {
          title: "指挥人员",
          name: "2",
          slot: "slot2"
        },
        {
          title: "工作分组",
          name: "3",
          slot: "slot3"
        },
        {
          title: "填报信息",
          name: "4",
          slot: "slot4"
        }
      ],
      dialogConfig: {
        title: "应急指挥部",
        isShow: false, // 弹窗显示隐藏
        width: "80%",
        btnList: [
          {
            name: "提交",
            id: "Submit", // 事件名
            type: "primary",
            size: "small"
          },
          {
            name: "保存",
            id: "save",
            size: "small"
          },
          {
            name: "取消",
            id: "cancel",
            size: "small"
          }
        ]
      },
      dialogConfig1: {
        title: "应急指挥部",
        isShow: false, // 弹窗显示隐藏
        btnList: [
          {
            name: "同意",
            id: "agree", // 事件名
            type: "primary",
            size: "small"
          },
          {
            name: "驳回",
            id: "rejected",
            size: "small"
          },
          {
            name: "取消",
            id: "cancel",
            size: "small"
          }
        ]
      },
      activeNames: ["1", "2", "3", "4", "5"],
      cylist: [],
      zuzlist: [],
      gzzmclist: [],
      xmlist: [],
      xymldlist: [],
      form: {},
      tableDatagz: [],
      tableData: [],
      responseOption: [],
      // 姓名option
      namelist: [],
      // 响应命令单详情
      configData: {}
    };
  },
  watch: {
    "dialogConfig.isShow": {
      handler(val) {
        console.log(val, "??????????????????val");
        if (val) {
          this.checkConfig();
          this.getInputVal();
          this.getNameList();
          if (this.id === "") {
            this.$nextTick(() => {
              this.$set(this.$refs.formComponent.form, "headquartersLv", 1);
              this.$set(this.$refs.formComponent.form, "headquartersLvName", "现场指挥部");
              this.getTemplete(1);
            });
          }
          this.$nextTick(() => {
            this.getCommand();
          });
        } else {
          this.dialogConfig.isShow = false;
          this.$emit("list");
          // this.cancel();
        }
      },
      deep: true,
      immediate: true
    },
    "dialogConfig1.isShow": {
      handler(val) {
        console.log(val, "??????????????????val");
        if (val) {
          this.checkConfig();
          this.getInputVal();
          this.getNameList();
          this.getCommand();
        } else {
          this.dialogConfig.isShow = false;
          this.$emit("list");
          // this.cancel();
        }
      },
      deep: true,
      immediate: true
    }
  },
  mounted() {
    if (this.$route.query.id) {
      setTimeout(() => {
        responseDetail({ id: this.$route.query.id }).then(res => {
          this.configData = {
            eventCode: res.eventCode,
            eventName: res.eventName,
            responseLvCode: res.responseLvCode,
            responseLvName: res.responseLvName,
            effectRange: res.effectRange,
            effectTime: res.effectTime,
            emergencyId: res.emergencyId
          };
          this.$set(this.$refs.formComponent.form, "responseId", this.$route.query.id);
          this.$set(this.$refs.formComponent.form, "responseName", res.responseName);
          this.handleChange(this.$route.query.id, { label: "响应命令单", option: this.formConfig.formData[0].option });

        });
      }, 500);
    }

  },
  methods: {
    checkConfig() {
      if (this.type.code === "approval") {
        this.dialogConfig1.isShow = true;
        this.titleConfig = [
          {
            title: "基本信息",
            name: "1",
            slot: "slot1"
          },
          {
            title: "指挥人员",
            name: "2",
            slot: "slot2"
          },
          {
            title: "工作分组",
            name: "3",
            slot: "slot3"
          },
          {
            title: "填报信息",
            name: "4",
            slot: "slot4"
          },
          {
            title: "审批信息",
            name: "5",
            slot: "slot5"
          }
        ];
        this.formConfig.formData.forEach(i => {
          i.isDisabled = true;
        });
        this.$nextTick(() => {
          this.$set(this.$refs.formComponent4.form, "approvalUser", JSON.parse(sessionStorage.getItem("account")).realName);
          this.$set(this.$refs.formComponent4.form, "approvalDept", sessionStorage.getItem("dwbmName"));
          this.$set(this.$refs.formComponent4.form, "approvalTime", showTime(new Date()));
        });
      } else if (["add", "edit"].includes(this.type.code)) {
        this.dialogConfig.isShow = true;
        this.titleConfig = [
          {
            title: "基本信息",
            name: "1",
            slot: "slot1"
          },
          {
            title: "指挥人员",
            name: "2",
            slot: "slot2"
          },
          {
            title: "工作分组",
            name: "3",
            slot: "slot3"
          },
          {
            title: "填报信息",
            name: "4",
            slot: "slot4"
          }
        ];
        this.$nextTick(() => {
          this.$set(this.$refs.formComponent3.form, "creator", JSON.parse(sessionStorage.getItem("account")).realName);
          this.$set(this.$refs.formComponent3.form, "createDeptName", sessionStorage.getItem("dwbmName"));
          this.$set(this.$refs.formComponent3.form, "createTime", showTime(new Date()));
        });
      } else {
        this.dialogConfig.isShow = true;
      }
    },
    clearValue() {
      this.$nextTick(() => {
        this.tableList.tableData = [];
        this.tableList1.tableData = [];
      });
    },
    radioChange(val, item) {
      this.getTemplete(val);
      this.$nextTick(() => {
        this.$set(this.$refs.formComponent.form, "commandTemplateId", "");
        this.$set(this.$refs.formComponent.form, "commandTemplateName", "");
        // this.$set(this.$refs.formComponent.form, "headquartersName", "");
        // this.$set(this.$refs.formComponent.form, "responseId", "");
        // this.$set(this.$refs.formComponent.form, "responseName", "");
        this.tableList.tableData = [];
        this.tableList1.tableData = [];
      });

      // const templateId = this.$refs.formComponent.form.commandTemplateId || "";
      const responseName = this.$refs.formComponent.form.responseName || "";
      const dep = JSON.parse(sessionStorage.getItem("org")).departmentName;
      if (responseName) {
        if (val === 0) {
          this.$set(this.$refs.formComponent.form, "headquartersName", `${responseName}应急指挥部`);
        } else if (val === 1) {
          this.$set(this.$refs.formComponent.form, "headquartersName", `${responseName}现场指挥部`);
        } else if (val === 2) {
          this.$set(this.$refs.formComponent.form, "headquartersName", `${responseName}${dep}应急指挥部`);
        } else if (val === 3) {
          this.$set(this.$refs.formComponent.form, "headquartersName", `${responseName}${dep}县级指挥部`);
        }
      }
    },
    // 获取指挥部模板
    async getTemplete(val) {
      const res = await commandTemplate({ headquartersLv: val });
      const option = res.map((item) => {
        return {
          label: item.templateName,
          value: item.id
        };
      });
      this.formConfig.formData[3].option = option;
    },
    // 获取响应命令单下拉
    getCommand() {
      const orgId = JSON.parse(sessionStorage.getItem("org")).orgId;
      selectResponse({ unitId: orgId }).then(res => {
        this.formConfig.formData.map(i => {
          const option = res.map((item) => {
            return {
              label: item.responseName,
              value: item.id,
              level: item.level
            };
          });
          if (i.label === "响应命令单") {
            i.option = option;
          }
        });
      });
    },
    // 下拉监听
    async handleChange(val, item) {
      if (item.label === "响应命令单") {
        this.$nextTick(() => {
          const nowLv = item.option.filter(i => i.value === val);
          console.log(nowLv, "----nowLv");
          if (nowLv[0].level === -1) {
            this.formConfig.formData[1].radio =
              [
                {
                  label: "现场指挥部",
                  value: 1,
                  isDisabled: false
                }
              ];
            this.$set(this.$refs.formComponent.form, "headquartersLv", 1);
            this.$set(this.$refs.formComponent.form, "headquartersLvName", "现场指挥部");
          } else if (nowLv[0].level === 2) {
            this.formConfig.formData[1].radio =
              [
                {
                  label: "现场指挥部",
                  value: 1,
                  isDisabled: false
                },
                {
                  label: "地市级指挥部",
                  value: 2,
                  isDisabled: false
                }
              ];
            this.$set(this.$refs.formComponent.form, "headquartersLv", 2);
            this.$set(this.$refs.formComponent.form, "headquartersLvName", "地市级指挥部");
          } else if (nowLv[0].level === 3) {
            this.formConfig.formData[1].radio =
              [
                {
                  label: "现场指挥部",
                  value: 1,
                  isDisabled: false
                },
                {
                  label: "县级指挥部",
                  value: 3,
                  isDisabled: false
                }
              ];
            this.$set(this.$refs.formComponent.form, "headquartersLv", 3);
            this.$set(this.$refs.formComponent.form, "headquartersLvName", "县级指挥部");
          } else {
            this.formConfig.formData[1].radio =
              [
                {
                  label: "省级指挥部",
                  value: 0,
                  isDisabled: false
                },
                {
                  label: "现场指挥部",
                  value: 1,
                  isDisabled: false
                }
              ];
            this.$set(this.$refs.formComponent.form, "headquartersLv", 0);
            this.$set(this.$refs.formComponent.form, "headquartersLvName", "省级指挥部");
          }
          this.getTemplete(this.$refs.formComponent.form.headquartersLv);
        });
        let responseName = "";
        const grade = this.$refs.formComponent.form.headquartersLv;
        const dep = JSON.parse(sessionStorage.getItem("org")).departmentName;
        item.option.forEach(item => {
          if (item.value === val) {
            responseName = item.label;
          }
        });
        responseDetail({ id: val }).then(res => {
          this.configData = {
            eventCode: res.eventCode,
            eventName: res.eventName,
            responseLvCode: res.responseLvCode,
            responseLvName: res.responseLvName,
            effectRange: res.effectRange,
            effectTime: res.effectTime,
            emergencyId: res.emergencyId
          };
        });
        // 根据指挥部级别生成指挥部名称
        if (grade === 0) {
          this.$set(this.$refs.formComponent.form, "headquartersName", `${responseName}应急指挥部`);
        } else if (grade === 1) {
          this.$set(this.$refs.formComponent.form, "headquartersName", `${responseName}现场指挥部`);
        } else if (grade === 2) {
          this.$set(this.$refs.formComponent.form, "headquartersName", `${responseName}${dep}应急指挥部`);
        } else if (grade === 3) {
          this.$set(this.$refs.formComponent.form, "headquartersName", `${responseName}${dep}县级指挥部`);
        }
      } else if (item.label === "指挥部模板") {
        if (val) {
          const res = await commandTemplateDetail({ id: val });
          const tableData = res.accountUsers.map((i) => {
            return {
              templateId: i.id,
              post: i.post,
              responsibility: i.responsibility,
              id: i.id,
              userId: i.userId,
              userName: i.userName,
              contact: i.contact,
              unitDept: i.unitDept,
              duty: i.duty,
              unit: i.unit,
              dept: i.dept
            };
          });
          const tableData1 = res.groupUsers.map((i) => {
            return {
              workGroupId: i.workGroupId,
              workGroup: i.workGroup,
              responsibility: i.responsibility,
              templateId: i.id,
              userId: i.userId,
              userName: i.userName,
              contact: i.contact,
              unitDept: i.unitDept,
              duty: i.duty,
              dept: i.dept,
              unit: i.unit,
              memberIds: i.memberIds !== null ? (i.memberIds).split(",") : [],
              members: i.members !== null ? (i.members).split(",") : []
            };
          });
          this.tableList.tableData = tableData;
          this.tableList1.tableData = tableData1;
        }

      }
    },
    getNameList() {
      // 获取姓名下拉;
      const parmas = {
        pageNum: 1,
        pageSize: 10,
        orgId: JSON.parse(sessionStorage.getItem("org")).orgId
      };
      TestUserOption(parmas).then(res => {
        // TestUserOption(parmas).then(res => {
        const option = res.map((item) => {
          return {
            label: item.userName,
            value: item.userId
          };
        });
        this.namelist = option;
      });
    },
    getinfo() {
      this.tableList.tableData = this.tableData;
    },
    handleClose() {
      this.formConfig.formData = this.$options.data().formConfig.formData;
      this.$refs.formComponent.form = this.$refs.formComponent.$options.data().form;
      this.tableList.tableData = [];
      this.tableList1.tableData = [
        {
          groupType: "",
          userId: "",
          contact: "",
          unitDept: "",
          duty: "",
          members: "",
          responsibility: ""
        }
      ];
      if (["edit", "add"].includes(this.type.code)) {
        this.dialogConfig.isShow = false;
      } else {
        this.dialogConfig1.isShow = false;
      }
      if (this.$route.query.id) {
        this.$router.push({ path: "/EmergencyResponselist" });
      }
    },
    handleBtn(item) {
      this[item.id]();
    },
    // 获取下拉框数据
    getInputVal() {
      getDictByGroupEmergency({ groupCode: "dic_gzfz" }).then(res => {
        const option = res.map((item) => {
          return {
            label: item.dicName,
            value: item.dicCode
          };
        });
        this.$set(this, "gzzmclist", option);
        console.log();
      });
    },
    // 取消
    cancel() {
      this.$emit("update:dialogVisible", false);
      if (this.$route.query.id) {
        this.$router.push({ path: "/EmergencyResponselist" });
      }
    },
    // 获取详情
    getDetail(val) {
      getDetailById({ id: val }).then(res => {
        this.getTemplete(res.headquartersLv);
        if (res.headquartersLv) {
          if (res.headquartersLv == "0") {
            this.formConfig.formData[1].radio =
              [
                {
                  label: "省级指挥部",
                  value: 0,
                  isDisabled: false
                },
                {
                  label: "现场指挥部",
                  value: 1,
                  isDisabled: false
                }
              ];
          } else if (res.headquartersLv == "1") {
            this.formConfig.formData[1].radio =
              [
                {
                  label: "现场指挥部",
                  value: 1,
                  isDisabled: false
                }
              ];

          } else if (res.headquartersLv == "2") {
            this.formConfig.formData[1].radio =
              [
                {
                  label: "现场指挥部",
                  value: 1,
                  isDisabled: false
                },
                {
                  label: "地市级指挥部",
                  value: 2,
                  isDisabled: false
                }
              ];
          } else if (res.headquartersLv == "3") {
            this.formConfig.formData[1].radio =
              [
                {
                  label: "现场指挥部",
                  value: 1,
                  isDisabled: false
                },
                {
                  label: "县级指挥部",
                  value: 3,
                  isDisabled: false
                }
              ];
          }
        }
        this.$set(this.$refs.formComponent.form, "responseId", res.responseId);
        this.$set(this.$refs.formComponent.form, "responseName", res.responseName);
        this.$set(this.$refs.formComponent.form, "headquartersName", res.headquartersName);
        this.$set(this.$refs.formComponent.form, "commandTemplateId", res.commandTemplateId);
        this.$set(this.$refs.formComponent.form, "commandTemplateName", res.commandTemplateName);
        this.$set(this.$refs.formComponent.form, "headquartersLvName", res.headquartersLvName);
        this.$set(this.$refs.formComponent.form, "headquartersLv", Number(res.headquartersLv));
        this.$set(this.tableList, "tableData", res.commandUserDetailVoList);
        this.$set(this.tableList1, "tableData", res.commandGroupDetailVoList);
        if (this.type.code === "approval") {
          this.formConfig.formData[1].radio.forEach(i => {
            if (i.value !== Number(res.headquartersLv)) {
              i.isDisabled = true;
            }
          });
          this.$nextTick(() => {
            this.$set(this.$refs.formComponent3.form, "creator", res.fillUser);
            this.$set(this.$refs.formComponent3.form, "createDeptName", res.fillUserDept);
            this.$set(this.$refs.formComponent3.form, "createTime", res.fillTime);
          });
          // const result = res.commandGroupDetailVoList;
          // result.forEach(item => {
          //   item.members = (item.members).replace(/,/g, "、");
          // });
          // this.$set(this.tableList1, "tableData", result);
        } else if (this.type.code === "edit") {
          const list = res.commandGroupDetailVoList;
          list.forEach(i => {
            // i.members = (i.members).replace(/,/g, ",");
            // i.memberIds = (i.memberIds).replace(/,/g, ",");
            i.members = i.members.split(",");
            i.memberIds = i.memberIds.split(",");
          });
          this.$set(this.tableList1, "tableData", list);
        }
        // this.$nextTick(() => {
        //   this.$set(this.$refs.formComponent3.form, "creator", JSON.parse(sessionStorage.getItem("account")).realName);
        //   this.$set(this.$refs.formComponent3.form, "createDeptName", JSON.parse(sessionStorage.getItem("org")).orgName);
        //   this.$set(this.$refs.formComponent3.form, "createTime", showTime(new Date()));
        // });
      });
    },
    // 提交
    Submit() {
      this.save("Submit");
    },
    // 同意
    agree() {
      this.save("agree");
    },
    // 驳回
    rejected() {
      this.save("rejected");
    },
    // 保存
    save(val) {
      this.$refs.formComponent.isValidate();
      const flag = this.$refs.formComponent.flag;
      if (flag) {
        const groupUsers = JSON.parse(JSON.stringify(this.tableList1.tableData));
        const parmas = {
          responseId: this.$refs.formComponent.form.responseId,
          responseName: this.$refs.formComponent.form.responseName,
          groupUsers: groupUsers,
          headquartersName: this.$refs.formComponent.form.headquartersName,
          commandTemplateId: this.$refs.formComponent.form.commandTemplateId,
          commandTemplateName: this.$refs.formComponent.form.commandTemplateName,
          accountUsers: this.tableList.tableData,
          fillUser: this.$refs.formComponent3.form.creator,
          fillUserDept: this.$refs.formComponent3.form.createDeptName,
          id: this.id || "",
          ...this.configData,
          headquartersLvName: this.$refs.formComponent.form.headquartersLvName,
          headquartersLv: this.$refs.formComponent.form.headquartersLv
        };
        if (val === "Submit") {
          parmas.groupUsers.forEach(i => {
            console.log(i.members, "???????i.members");
            i.members = i.members.join(",");
            i.memberIds = i.memberIds.join(",");
          });
          detailSubmit(parmas).then(res => {
            if (res) {
              this.$message({
                message: "提交成功",
                type: "success"
              });
              if (this.type.code === "approval") {
                this.dialogConfig1.isShow = false;
              } else {
                this.dialogConfig.isShow = false;
              }
              this.$emit("getList");
            }
          });
        } else if (val === "agree") {
          parmas.approveSign = "pass";
          parmas.approvalOpinion = this.$refs.formComponent4.form.approvalOpinion;
          parmas.approvalUserId = JSON.parse(sessionStorage.getItem("account")).id;
          parmas.approvalUser = JSON.parse(sessionStorage.getItem("account")).realName;
          parmas.approvalDeptId = JSON.parse(sessionStorage.getItem("org")).orgCode;
          parmas.approvalDept = sessionStorage.getItem("dwbmName");
          detailApproval(parmas).then(res => {
            if (res) {
              this.$message({
                message: "审核成功",
                type: "success"
              });
              if (this.type.code === "approval") {
                this.dialogConfig1.isShow = false;
              } else {
                this.dialogConfig.isShow = false;
              }
              this.$emit("getList");
            }
          });
        } else if (val === "rejected") {
          parmas.approveSign = "reject";
          parmas.approvalOpinion = this.$refs.formComponent4.form.approvalOpinion;
          parmas.approvalUserId = JSON.parse(sessionStorage.getItem("account")).id;
          parmas.approvalUser = JSON.parse(sessionStorage.getItem("account")).realName;
          parmas.approvalDeptId = JSON.parse(sessionStorage.getItem("org")).orgCode;
          parmas.approvalDept = sessionStorage.getItem("dwbmName");
          detailApproval(parmas).then(res => {
            if (res) {
              this.$message({
                message: "审核成功",
                type: "success"
              });
              if (this.type.code === "approval") {
                this.dialogConfig1.isShow = false;
              } else {
                this.dialogConfig.isShow = false;
              }
              this.$emit("getList");
            }
          });
        } else {
          groupUsers.forEach(i => {
            i.members = i.members.join(",");
            i.memberIds = i.memberIds.join(",");
          });
          detailSave(parmas).then(res => {
            if (res) {
              this.$message({
                message: "保存成功",
                type: "success"
              });
              this.dialogConfig.isShow = false;
              this.$emit("getList");
            }
          });
        }
      }
      if (this.$route.query.id) {
        this.$router.push({ path: this.$route.path });
      }
    }
  }
};
</script>

<style scoped lang="less"></style>
